<template>
  <div style="margin:auto;width:1200px;border:1px solid #000">
      <h1 style="text-align:center">进销存管理系统</h1>
      <div style="text-align:right;margin-right:100px;">欢迎光临，{{loginUser.userName}}</div>

      <el-row>
        <el-col :span="5">
            <el-menu
            default-active="2"
            class="el-menu-vertical-demo"
            background-color="#545c64"
            text-color="#fff"
            active-text-color="#ffd04b">

            <el-submenu index="1" v-if="isShowModel('供应商管理') || isShowModel('客户管理')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>资料管理</span>
                </template>
                <el-menu-item index="1-1" v-if="isShowModel('供应商管理')">供应商管理</el-menu-item>
                <el-menu-item index="1-2" v-if="isShowModel('客户管理')">客户管理</el-menu-item>
            </el-submenu>

            <el-submenu index="2" v-if="isShowModel('采购入库') || isShowModel('采购信息查询')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>采购管理</span>
                </template>
                <el-menu-item index="2-1" v-if="isShowModel('采购入库')">采购入库</el-menu-item>
                <el-menu-item index="2-2" v-if="isShowModel('采购信息查询')">采购信息查询</el-menu-item>
            </el-submenu>

            <el-submenu index="3" v-if="isShowModel('销售出库') || isShowModel('销售信息查询')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>销售管理</span>
                </template>
                <el-menu-item index="3-1" v-if="isShowModel('销售出库')">销售出库</el-menu-item>
                <el-menu-item index="3-2" v-if="isShowModel('销售信息查询')">销售信息查询</el-menu-item>
            </el-submenu>

            <el-menu-item index="4" v-if="isShowModel('库存管理')">
              <i class="el-icon-setting"></i>
              <span slot="title">库存管理</span>
            </el-menu-item>

            <el-submenu index="5"  v-if="isShowModel('销售统计') || isShowModel('客户统计')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>统计信息</span>
                </template>
                <el-menu-item index="5-1" v-if="isShowModel('销售统计')" @click="$router.push('/index/count')">销售统计</el-menu-item>
                <el-menu-item index="5-2" v-if="isShowModel('客户统计')">客户统计</el-menu-item>
            </el-submenu>

            <el-submenu index="6"  v-if="isShowModel('用户管理') || isShowModel('角色管理')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>权限管理</span>
                </template>
                <el-menu-item index="6-1"  v-if="isShowModel('用户管理')" @click="$router.push('/index/user')">用户管理</el-menu-item>
                <el-menu-item index="6-2"  v-if="isShowModel('角色管理')" @click="$router.push('/index/role')">角色管理</el-menu-item>
            </el-submenu>

             <el-submenu index="7">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>个人信息管理</span>
                </template>
                <el-menu-item index="7-1">修改密码</el-menu-item>
            </el-submenu>

             <el-submenu index="6" v-if="isShowModel('日志一览')">
                <template slot="title">
                <i class="el-icon-location"></i>
                <span>日志信息</span>
                </template>
                <el-menu-item index="6-1">日志一览</el-menu-item>
            </el-submenu>
            
            </el-menu>
        </el-col>

           <el-col :span="19"><router-view/></el-col>
        </el-row>
  </div>
</template>

<script>
import {mapState,mapActions} from "vuex"
export default {
   data(){
     return {

     }
   },
   methods:{
     ...mapActions("user",["getLoginUser"]),
     //判断登陆用户是否有指定权限
     isShowModel(gradeName){
          //判断登陆用户权限是否为undefined
          if(this.loginUser.gradeList == undefined){
            return false;
          }
          //查找指定权限在登陆用户权限集合的下标，如果为-1表示没有找到
        var index = this.loginUser.gradeList.findIndex((n)=>n.name == gradeName);
        if(index != -1){
          return true;
        }

        return false;
      }
   },
   computed:{
      ...mapState("user",["loginUser"])
   },
   created(){
     //得到登陆用户对象
      this.getLoginUser();
   }
}
</script>

<style>

</style>